<template>
  <div class="app-container">
  
    <!-- 查询条件 -->
    <el-form :model="queryParams" ref="queryRef" inline label-width="90px">
      <el-form-item label="枪械编号" prop="gunCode">
        <el-input v-model="queryParams.gunCode" placeholder="请输入枪械编号" clearable @keyup.enter="handleQuery"/>
      </el-form-item>
      
      <el-form-item label="内部编号" prop="internalNum">
        <el-input v-model="queryParams.internalNum" placeholder="请输入内部编号" clearable @keyup.enter="handleQuery"/>
      </el-form-item>
      
      <el-form-item label="内部编号范围">
        <el-input v-model="queryParams.internalNumBegin" placeholder="起" style="width:120px"/>
        <span style="margin:0 5px;">至</span>
        <el-input v-model="queryParams.internalNumEnd" placeholder="止" style="width:120px"/>
      </el-form-item>
      
      <el-form-item label="枪械类型" prop="gunCategory">
        <el-input v-model="queryParams.gunCategory" placeholder="请输入枪械类型"/>
      </el-form-item>
      
      <el-form-item label="枪械状态" prop="gunStatus">
        <el-select v-model="queryParams.gunStatus" placeholder="请选择" clearable>
          <el-option label="库存" :value="1"/>
          <el-option label="已发出" :value="2"/>
          <el-option label="禁用" :value="3"/>
        </el-select>      
      </el-form-item>
      
      <el-form-item>
        <el-button type="primary" @click="handleQuery">查询</el-button>
        <el-button @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>
    
    <!-- 标题 -->
    <h2 style="text-align:center;margin:15px 0;">
      公务用枪配备明细表    
    </h2>
    
    <!-- 列表 -->    
    <el-table :data="gunList" border stripe v-loading="loading">
              
      <el-table-column type="index" label="#" width="60" align="center"/>      
      <el-table-column label="配发日期" prop="buyDate" min-width="120">
        <template #default="scope">{{ parseTime(scope.row.buyDate, '{y}-{m}-{d}') }}</template>
      </el-table-column>
            
      <el-table-column label="枪型" prop="gunCategoryName" min-width="120"/>      
      <el-table-column label="枪号/弹盒号" prop="gunCode" min-width="120"/>      
      <el-table-column label="内部编号" prop="internalNum" min-width="120"/>      
      <el-table-column label="枪证号码" prop="gunLicenceId" min-width="120"/>      

      <el-table-column label="管理状态" prop="gunStatus" min-width="100">        
        <template #default="scope">
          {{ scope.row.gunStatus == 1 ? '库存' : scope.row.gunStatus == 2 ? '已发出' : '禁用' }}
        </template>
      </el-table-column>
      
      <el-table-column label="痕迹建档" prop="traceArchived" min-width="90">
        <template #default="scope">
          {{ scope.row.traceArchived == 1 ? '已建档' : '未建档' }}
        </template>
      </el-table-column>
      
      <el-table-column label="修改日期" prop="updateTime" min-width="160">
        <template #default="scope">{{ parseTime(scope.row.updateTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</template>
      </el-table-column>
      
      <el-table-column label="出勤次数" prop="userCount" min-width="90"/>
      <el-table-column label="擦拭日期" prop="cleanDate" min-width="160">        
        <template #default="scope">{{ parseTime(scope.row.cleanDate) }}</template>
      </el-table-column>
      
      <el-table-column label="分解日期" prop="checkDate" min-width="160">
        <template #default="scope">{{ parseTime(scope.row.checkDate) }}</template>
      </el-table-column>
          
    </el-table>    
    
    <!-- 分页 -->
    <pagination
      v-show="total>0"     
      :total="total"
      v-model:page="queryParams.pageNum"      
      v-model:limit="queryParams.pageSize"      
      @pagination="getList"    
    />
  </div>
</template>

<script setup name="Gun">
import { listGunEquip } from "@/api/service/gun"

const { proxy } = getCurrentInstance()

const gunList = ref([])
const open = ref(false)
const loading = ref(true)
const showSearch = ref(true)
const ids = ref([])
const single = ref(true)
const multiple = ref(true)
const total = ref(0)
const title = ref("")

const data = reactive({
  form: {},
  queryParams: {
    pageNum: 1,
    pageSize: 10,
    gunCategory: null,
    gunCode: null,
    internalNum: null,
    internalNumBegin: null,    
    internalNumEnd: null,        
    gunStatus: null,
  },
  rules: {
    gunCategory: [
      { required: true, message: "枪型不能为空", trigger: "blur" }
    ],
  }
})

const { queryParams, form, rules } = toRefs(data)

/** 查询枪支管理列表 */
function getList() {
  loading.value = true
  console.log('请求参数:', queryParams.value) // 记录请求参数
  listGunEquip(queryParams.value).then(response => {
    gunList.value = response.rows
    total.value = response.total
    loading.value = false
  })
  .catch(error => {
      console.error('请求失败详情:', error)
      console.error('错误堆栈:', error.stack)
      loading.value = false
       if (error.message) {
        proxy.$message.error('数据加载失败: ' + error.message)
      } else {
        proxy.$message.error('数据加载失败，请检查网络连接或联系管理员')
      }
    })
}

// 取消按钮
function cancel() {
  open.value = false
  reset()
}

// 表单重置
function reset() {
  form.value = {
    id: null,
    buyDate: null,
    gunCategory: null,
    gunCode: null,
    internalNum: null,
    gunLicenceId: null,
    gunStatus: null,
    updateTime: null,
    userCount: null,
    cleanDate: null,
    checkDate: null,
    operatorName: null,
    createUser: null,
    remark: null,
    departmentId: null,
    isClean: null,
    isCheck: null,
    createTime: null,
    updateUser: null,
    traceArchived: null,
    traceArchivedDate: null,
    traceArchivedNo: null,
    expireDate: null,
    deleted: null
  }
  proxy.resetForm("gunRef")
}

/** 搜索按钮操作 */
function handleQuery() {
  queryParams.value.pageNum = 1
  getList()
}

/** 重置按钮操作 */
function resetQuery() {
  proxy.resetForm("queryRef")
  handleQuery()
}

getList();
</script>
